import BizHeader from '@inbiz/basic/BizHeader';
import BizBody from '@inbiz/basic/BizBody';
// @ts-ignore
import styles from './style.less';
import './style.less';
import StandardList from './components/StandardList';
import GridList from './components/GridList';
import Filter from './components/Filter';

interface Props {
  title: any;
  iconOption: any;
  dataSource1: any;
  dataSource2: any;
  dataSource3: any;
  view: string;
  fontSize: string | number;
  contentType: number;
  className: string;
  radius: string;
  mobilerowCount: number;
  verticalGutter: number;
  horizontalGutter: number;
  gridHeight: number;
  shadow: boolean;
  style: any;
  emit?: () => void;
}

/**
 * InbizMagicLinks 组件
 */
const InbizMagicLinks = (props: Props) => {
  const { dataSource1, view, fontSize, contentType, className, radius } = props;
  let newDataSource = dataSource1.filter((item: any) => !item.hide);

  const childProps = {
    newDataSource,
    contentType,
    fontSize,
    radius,
  };

  const { style = {}, ..._props } = props

  return (
    <div className={className}>
      <div className={styles.InbizMagicLinks}>
        <BizHeader {...props} />
        <BizBody {..._props} style={{ ...style, overflow: 'visible' }}>
          {view == 'standard' ? (
            <StandardList {...props} {...childProps} />
          ) : view == 'grid' ? (
            <GridList {...props} newDataSource={newDataSource} />
          ) : view == 'filter' ? (
            <Filter {...props} newDataSource={newDataSource} />
          ) : null}
        </BizBody>
      </div>
    </div>
  );
};

export default InbizMagicLinks;
